<template>
    <view>
        <!-- <back></back> -->
        <!-- <view class="bakbtn1">
            <view class="bakbtn" @click="getBp()">
                <image src="https://same.ascetic.top/static/img/backbtn.png" mode=""></image>
            </view>
            <text class="text">订单详情</text>
        </view> -->

        <view class="all">
            <view class="card">
                <view
                    v-for="(item, index) in detail.goods"
                    :key="index"
                    @click="go(item)"
                >
                    <view class="top">
                        <view class="left" @click="goShop(detail.shop_id)">
                            <image
                                class="icon_sj"
                                :src="BaseUrl + '/static/common/cen7.png'"
                                mode="scaleToFill"
                            />
                            <text class="mendian">{{
                                detail.shop.shopname
                            }}</text>
                            <image
                                class="icon_arrow"
                                :src="BaseUrl + '/static/wImg/arrowRig.png'"
                                mode="scaleToFill"
                            />
                        </view>
                    </view>
                    <view class="u-flex-center u-row-left u-m-b-20">
                        <image
                            :src="'https://same.ascetic.top' + item.image"
                            mode="aspectFill"
                            class="head-img"
                        ></image>
                        <view
                            class="u-flex-center u-row-between"
                            style="width: 100%"
                        >
                            <view class="cont">
                                <view class="name u-line-2">{{
                                    item.title
                                }}</view>
                                <view class="cate"
                                    >规格：{{ item.difference }}</view
                                >
                                <view class="price u-m-t-20"
                                    ><text>￥</text>{{ item.price }}</view
                                >
                            </view>
                            <view class="number">×{{ item.number }}</view>
                        </view>
                    </view>
                    <view
                        v-if="detail.state !== 1 && detail.state < 7"
                        class="u-flex u-row-right"
                    >
                        <view
                            class="button"
                            @click.stop="
                                $func.jump(
                                    '/yCreate/pages/afterSale?id=' +
                                        id +
                                        '&item=' +
                                        JSON.stringify(item) +
                                        '&index=' +
                                        index +
                                        '&shopname=' +
                                        detail.shop.shopname +
                                        '&shop_id=' +
                                        detail.shop_id
                                )
                            "
                            v-if="item.refund_status == 0"
                            >退款</view
                        >
                        <view
                            class="button"
                            v-if="item.refund_status == 1"
                            @click.stop="
                                $func.jump(
                                    '/yCreate/pages/details?id=' +
                                        item.refund_id +
                                        '&item=' +
                                        JSON.stringify(item)
                                )
                            "
                            >退款中</view
                        >
                        <view
                            class="button"
                            v-if="item.refund_status == 2"
                             @click.stop="
                                $func.jump(
                                    '/yCreate/pages/details?id=' +
                                        item.refund_id +
                                        '&item=' +
                                        JSON.stringify(item)
                                )
                            "
                            >卖家已同意退款，请退货</view
                        >
                        <view
                            class="button button2"
                            v-if="item.refund_status == 5"
                            @click.stop="
                                $func.jump(
                                    '/yCreate/pages/details?id=' +
                                        item.refund_id +
                                        '&item=' +
                                        JSON.stringify(item)
                                )
                            "
                            >拒绝退款</view
                        >
                        <view
                            class="button button3"
                            v-if="item.refund_status == 3"
                            @click.stop="
                                $func.jump(
                                    '/yCreate/pages/details?id=' +
                                        item.refund_id +
                                        '&item=' +
                                        JSON.stringify(item)
                                )
                            "
                            >退款成功</view
                        >
                        <view
                            class="button button3"
                            v-if="item.refund_status == 4"
                            @click.stop="
                                $func.jump(
                                    '/yCreate/pages/details?id=' +
                                        item.refund_id +
                                        '&item=' +
                                        JSON.stringify(item)
                                )
                            "
                            >退款已关闭</view
                        >
                    </view>
                </view>
            </view>
            <view class="card">
                <view class="top-title">订单信息</view>
                <view class="message-item u-flex u-row-between">
                    <view>订单状态</view>
                    <view class="red-status" v-if="detail.state == 1"
                        >待支付</view
                    >
                    <view class="red-status" v-if="detail.state == 2"
                        >待发货</view
                    >
                    <view
                        class="red-status"
                        v-if="detail.state == 3 && detail.goods[0].type == ''"
                        >待核销</view
                    >
                    <view
                        class="red-status"
                        v-if="
                            detail.state == 3 &&
                            detail.goods[0].type == 'normal'
                        "
                        >待收货</view
                    >
                    <view class="red-status" v-if="detail.state == 6"
                        >已完成</view
                    >
                    <view class="red-status" v-if="detail.state == 4"
                        >待评价</view
                    >
                </view>
                <view class="message-item u-flex u-row-between">
                    <view>订单号</view>
                    <text>{{ detail.order_no }}</text>
                </view>
                <view class="message-item u-flex u-row-between">
                    <view>下单时间</view>
                    <text>{{ detail.createtime_text }}</text>
                </view>
                <view
                    class="message-item u-flex u-row-between"
                    v-if="detail.state == 2 || detail.state == 3"
                >
                    <view>支付时间</view>
                    <text>{{ detail.paymenttime_text }}</text>
                </view>
                <view
                    class="message-item u-flex u-row-between"
                    v-if="detail.state != 1"
                >
                    <view>支付方式</view>
                    <text>{{
                        detail.pay.pay_type == 1
                            ? "微信支付"
                            : detail.pay.pay_type == 2
                            ? "支付宝支付"
                            : detail.pay.pay_type == 0
                            ? "余额支付"
                            : "余额支付"
                    }}</text>
                </view>
                <view
                    class="message-item u-flex u-row-between"
                    v-if="detail.state == 3"
                >
                    <view>发货时间</view>
                    <text>{{ detail.delivertime_text }}</text>
                </view>
                <view
                    class="message-item u-flex u-row-between"
                    v-if="detail.shop"
                >
                    <view>商家名称</view>
                    <text>{{ detail.shop.shopname }}</text>
                </view>
                <view
                    class="message-item u-flex u-row-between"
                    v-if="detail.pay"
                >
                    <view>商品价格</view>
                    <text>{{ detail.pay.order_price }}元</text>
                </view>
                <view
                    class="message-item u-flex u-row-between"
                    v-if="detail.pay"
                >
                    <view>优惠价格</view>
                    <text>{{ detail.pay.discount_price }}元</text>
                </view>
                <view
                    class="message-item u-flex u-row-between"
                    v-if="detail.pay"
                >
                    <view> 运费</view>
                    <text>{{ detail.pay.freight_price }}元</text>
                </view>
                <view
                    class="message-item u-flex u-row-between"
                    v-if="detail.pay"
                >
                    <view>使用积分</view>
                    <text>{{ detail.pay.score ? detail.pay.score : 0 }}</text>
                </view>
                <view
                    class="message-item u-flex u-row-between"
                    v-if="detail.pay"
                >
                    <view>抵扣金额</view>
                    <text
                        >{{
                            detail.pay.score_price ? detail.pay.score_price : 0
                        }}元</text
                    >
                </view>
                <view
                    class="message-item u-flex u-row-between"
                    v-if="detail.pay"
                >
                    <view>{{
                        detail.state == 1 ? "应付金额" : "实付金额"
                    }}</view>
                    <text class="red-status" v-if="detail.state !== 1"
                        >{{
                            detail.pay.actual_payment == 0.0
                                ? 0.01
                                : detail.pay.actual_payment
                        }}元
                    </text>
                    <text class="red-status" v-if="detail.state == 1"
                        >{{
                            detail.pay.price == 0.0 ? 0.01 : detail.pay.price
                        }}元
                    </text>
                </view>
                <view
                    class="message-item u-flex u-row-between"
                    v-if="detail.pay"
                >
                    <view>订单备注</view>
                    <text>{{ detail.remarks || "无备注" }}</text>
                </view>
                <view
                    class="message-item u-flex u-col-top u-row-between"
                    v-if="detail.address"
                >
                    <view class="u-m-r-30">收货信息</view>
                    <view>
                        <text
                            >{{ detail.address.name }}
                            {{ detail.address.mobile }}
                        </text>
                        <text>{{ detail.address.address }}</text>
                    </view>
                </view>
            </view>
            <view class="card" v-if="!shop && detail.refund != ''">
                <view class="top-title">售后信息</view>
                <view class="message-item u-flex u-row-between">
                    <view>售后状态</view>
                    <text class="red-status" v-if="detail.refund.state == 0"
                        >待审核</text
                    >
                    <text class="red-status" v-if="detail.refund.state == 1"
                        >待退货</text
                    >
                    <text class="red-status" v-if="detail.refund.state == 2"
                        >已驳回</text
                    >
                    <text class="red-status" v-if="detail.refund.state == 4"
                        >已退款</text
                    >
                    <text class="red-status" v-if="detail.refund.state == 5"
                        >退款已关闭</text
                    >
                    <text class="red-status" v-if="detail.refund.state == 6"
                        >已退回商品</text
                    >
                    <text class="red-status" v-if="detail.refund.state == 8"
                        >退款失败</text
                    >
                </view>
                <view
                    class="message-item u-flex u-row-between"
                    v-if="detail.refund.state == 1"
                >
                    <view>退货姓名</view>
                    <text>{{ detail.refund_address.returnName }}</text>
                </view>
                <view
                    class="message-item u-flex u-row-between"
                    v-if="detail.refund.state == 1"
                >
                    <view>退货手机号</view>
                    <text>{{ detail.refund_address.returnPhoneNum }}</text>
                </view>
                <view
                    class="message-item u-flex u-row-between"
                    v-if="detail.refund.state == 1"
                >
                    <view>退货地址</view>
                    <text>{{ detail.refund_address.returnAddr }}</text>
                </view>
                <view class="message-item u-flex u-row-between">
                    <view>申请时间</view>
                    <text>{{ detail.refund.createtime_text }}</text>
                </view>
                <view class="message-item u-flex u-row-between">
                    <view>实付金额</view>
                    <text class="red-status"
                        >{{ detail.pay.actual_payment }}元</text
                    >
                </view>
            </view>
            <view
                class="wulbtn"
                @click="show3 = true"
                v-if="!shop && detail.refund.state == 1"
            >
                填写退款物流单号
            </view>
        </view>
        <!-- <view class="layer">
			<view class="wul_layer">
				<view class="wultit">
					填写物流单号
					<image src="../../static/zhibo/guanbiW.png" mode="" class="gbwul"></image>
				</view>
				<view class="flex align-center margin-40">
					<view class="text-28">快递公司:</view>
					<view class="contbox text-28">
						请选择快递公司
					</view>
				</view>
				<view class="flex align-center margin-40">
					<view class="text-28">快递单号:</view>
					<input type="text" class="contbox text-28" placeholder="请输入快递单号"/>
				</view>
				<view class="wulbtn" @click="">
					确认
				</view>
			</view>
		</view> -->
        <view style="height: 300rpx; width: 100%"></view>
        <!-- <view class="box" v-if="detail.state == 2 && shop">
            <view class="u-flex u-row-between">
                <view class="btn btn2 btn3" @click="show3 = true">立即发货</view>
            </view>
        </view> -->
        <view class="">
            <view
                class="box"
                v-if="
                    detail.state == 1 ||
                    detail.state == 3 ||
                    detail.state == 2 ||
                    detail.state == 4 ||
                    detail.state == 7
                "
            >
                <view class="u-flex u-row-between">
                    <view
                        class="btn"
                        @click="show = true"
                        v-if="detail.state == 3"
                        >查看物流</view
                    >
                    <view
                        class="btn btn2"
                        v-if="detail.state == 3"
                        @click="confirm"
                        >确认收货</view
                    >
                    <view
                        class="btn btn2"
                        v-if="detail.state == 4"
                        @click="goComment(detail.id)"
                        >去评价</view
                    >
                    <view class="btns" @click="goDetail(detail)">
                        <view
                            class="btn2 btn"
                            v-if="[0, 1,2,4,6].includes(detail.state)"
                            >再来一单</view
                        >
                    </view>
                    <view
                        class="btn"
                        v-if="detail.state == 0"
                        @click="cancel"
                        >取消订单</view
                    >
                    <view
                        class="btn btn2"
                        v-if="detail.state == 1"
                        @click="pay(detail.id)"
                        >立即支付</view
                    >
                    <!-- <view class="btn btn3" v-if="detail.state == 2" @click="cancels">
                        取消订单</view
                    > -->
                    <!-- <view class="btn btn3" v-if="detail.state ==2" @click="$func.jump('/yCreate/pages/afterSale?id='+id)">申请退款</view> -->
                </view>
            </view>
        </view>
        <u-popup
            v-model="show"
            mode="bottom"
            border-radius="25"
            height="70%"
            closeable
            safe-area-inset-bottom
        >
            <view class="coupon">
                <view class="cou_tit">物流信息</view>
                <view style="height: 100rpx"></view>
                <view class="u-p-30">
                    <view class="u-flex u-row-between">
                        <view class="name u-flex">
                            <image
                                :src="BaseUrl + logistics.kuaidi.logo"
                                mode="aspectFill"
                            ></image>
                            <view
                                >{{
                                    logistics.kuaidi.name
                                        ? logistics.kuaidi.name
                                        : "快递公司"
                                }}
                                <text class="u-m-l-24">{{
                                    logistics.express_no
                                }}</text>
                            </view>
                        </view>
                        <view class="copy" @click="paste(logistics.order_no)"
                            >复制</view
                        >
                    </view>
                    <view class="u-p-20">
                        <u-time-line>
                            <u-time-line-item
                                v-for="item in logistics.express"
                                :key="item.time"
                            >
                                <template v-slot:node v-if="item.status">
                                    <view class="u-node"></view>
                                </template>
                                <template v-slot:content v-if="item.status">
                                    <view>
                                        <view class="u-order-title u-flex">
                                            <text class="u-m-r-15">{{
                                                item.status
                                            }}</text>
                                            <view class="u-order-time">{{
                                                item.time
                                            }}</view>
                                        </view>
                                        <!-- <view class="u-order-desc">您的快递。。。。【深圳市】已揽收，揽收人：加加加（<text>1836745744</text>）</view> -->
                                        <view class="u-order-desc">{{
                                            item.context
                                        }}</view>
                                    </view>
                                </template>
                            </u-time-line-item>
                        </u-time-line>
                    </view>
                </view>
                <view style="height: 10rpx"></view>
            </view>
        </u-popup>
        <u-popup v-model="show3" mode="center" border-radius="20">
            <view class="card2">
                <view class="pop-tit">物流信息</view>
                <view
                    class="item u-border-bottom u-flex-center u-row-between"
                    @click="show4 = true"
                >
                    <text>快递公司</text>
                    <text class="right" v-if="!corporation">{{
                        "请选择"
                    }}</text>
                    <text class="right right2" v-else>{{ corporation }}</text>
                </view>
                <view class="item u-border-bottom u-flex-center u-row-between">
                    <text>快递单号</text>
                    <input
                        type="text"
                        placeholder="请输入快递单号"
                        placeholder-class="ipt-sty"
                        v-model="orderNum"
                    />
                </view>
                <view class="flex pop-button u-row-between">
                    <view class="u-flex-center" @click="show3 = false"
                        >取消</view
                    >
                    <view class="u-flex-center b2" @click="getFahuo()"
                        >确定</view
                    >
                </view>
            </view>
        </u-popup>
        <u-select
            v-model="show4"
            :list="list3"
            label-name="name"
            value-name="code"
            @confirm="confirm1($event, 3)"
            confirm-color="#606DCE"
        ></u-select>
    </view>
</template>

<script>
//#ifdef  H5
var wx = require("jweixin-module");
//#endif
import back from "@/components/back.vue";
import { BaseUrl } from "@/utils/req";
export default {
    components: {
        back,
    },
    data() {
        return {
            BaseUrl,
            show: false,
            id: "",
            detail: {},
            logistics: {},
            show3: false,
            show4: false,
            list3: [],
            corporation: "",
            orderNum: "",
            shop: "",
            kdlist: [],
            state: 0,
        };
    },
    onLoad(options) {
        console.log(options, "111111111111111111111111");
        this.id = options.id;
        this.state = options.state;
        this.$u.post("api/shop/get_order_kuaidi").then((res) => {
            this.list3 = res.data;
        });
    },
    onShow() {
        if (this.id) {
            this.getDetail();
        }
    },
    methods: {
        //再来一单
        goDetail(i) {
            this.$request
                .get("api/wanlshop.product/goods", {
                    id: i.goods[0].goods_id,
                })
                .then((res) => {
                    console.log(res);
                    if ([11, 14].includes(res.data.category)) {
                        console.log(1);
                        uni.navigateTo({
                            url:
                                "/dabai/pages/caterDetails/caterDetails?id=" +
                                i.goods[0].goods_id,
                        });
                    } else {
                        console.log(2);
                        uni.navigateTo({
                            url:
                                "/pages/product/goods?id=" +
                                i.goods[0].goods_id,
                        });
                    }
                });
        },
        // 点击店铺
        goShop(id) {
            console.log(1);
            uni.navigateTo({
                url: "/dabai/pages/aShop/aShop?id=" + id,
            });
        },
        go(item) {
            console.log(item);
            this.$request
                .get("api/wanlshop.product/goods", {
                    id: item.goods_id,
                })
                .then((res) => {
                    console.log(res);
                    if ([11, 14].includes(res.data.category)) {
                        uni.navigateTo({
                            url:
                                "/dabai/pages/caterDetails/caterDetails?id=" +
                                item.goods_id,
                        });
                    } else {
                        uni.navigateTo({
                            url: "/pages/product/goods?id=" + item.goods_id,
                        });
                    }
                });
        },
        //去评价
        goComment(id) {
            uni.navigateTo({
                url: "/upRelease/comment/comment?order_id=" + id,
            });
        },
        confirm() {
            uni.showModal({
                title: "提示",
                content: "是否确认收货?",
                success: ({ confirm, cancel }) => {
                    if (confirm) {
                        this.$request
                            .post("api/wanlshop.order/confirmOrder", {
                                id: this.id,
                            })
                            .then((res) => {
                                if (res.code == 1) {
                                    uni.showToast({
                                        title: res.msg,
                                        icon: "none",
                                    });
                                    this.getDetail();
                                } else {
                                    uni.showToast({
                                        title: res.msg,
                                        icon: "none",
                                    });
                                }
                            });
                    }
                },
            });
        },
        //确认发货
        getFahuo() {
            if (this.detail.refund) {
                this.$request
                    .post("api/wanlshop.refund/toExpress", {
                        id: this.detail.refund.id,
                        express_name: this.corporation,
                        express_no: this.orderNum,
                    })
                    .then((res) => {
                        if (res.code == 1) {
                            this.getDetail();
                            this.show3 = false;
                        } else {
                            uni.showToast({
                                title: res.msg,
                                icon: "none",
                            });
                        }
                    });
            } else {
                this.$request
                    .post("api/wanlshop.merchant/shop_order_fh", {
                        order_id: this.id,
                        express_name: this.corporation,
                        express_no: this.orderNum,
                    })
                    .then((res) => {
                        if (res.code == 1) {
                            this.getDetail();
                            this.show3 = false;
                        } else {
                            uni.showToast({
                                title: res.msg,
                                icon: "none",
                            });
                        }
                    });
            }
        },
        async pay(id) {
            uni.navigateTo({
                url: `/pages/page/paysuccess?order_id=${id}&order_type=goods&PayNow=1`,
            });
        },
        cancel() {
            uni.showModal({
                title: "提示",
                content: "是否确认取消订单?",
                success: (res) => {
                    if (res.confirm) {
                        this.$request
                            .post("api/wanlshop.order/cancelOrder", {
                                id: this.id,
                            })
                            .then((res) => {
                                if (res.code == 1) {
                                    this.getDetail();
                                } else {
                                    uni.showToast({
                                        title: res.msg,
                                        icon: "none",
                                    });
                                }
                            });
                    }
                },
            });
        },
        cancels() {
            uni.showModal({
                title: "提示",
                content: "是否确认取消订单?",
                success: (res) => {
                    if (res.confirm) {
                        this.$request
                            .post("api/wanlshop.order/cancelOrder", {
                                id: this.id,
                            })
                            .then((res) => {
                                if (res.code == 1) {
                                    this.getDetail();
                                } else {
                                    uni.showToast({
                                        title: res.msg,
                                        icon: "none",
                                    });
                                }
                            });
                    }
                },
            });
        },
        paste(value) {
            uni.setClipboardData({
                data: value,
            });
        },
        getDetail() {
            this.$request
                .get("api/wanlshop.order/getOrderInfo", {
                    id: this.id,
                })
                .then((res) => {
                    this.detail = res.data;
                    console.log(this.detail);
                    this.shop = this.detail.shop ? this.detail.shop : "";
                });
            this.$request
                .post("api/wanlshop.order/getLogistics", {
                    id: this.id,
                })
                .then((res) => {
                    console.log(res, "====================---------");
                    this.logistics = res.data;
                });
        },
        getBp() {
            uni.navigateBack({
                delta: 1,
            });
        },
        confirm1(e, type) {
            if (type == 1) {
                this.current = e[0].value - 1;
                this.mescroll.resetUpScroll();
            } else if (type == 2) {
                this.take = e[0].value;
                this.mescroll.resetUpScroll();
            } else {
                this.code = e[0].value;
                this.corporation = e[0].label;
            }
        },
    },
};
</script>

<style lang="scss">
@import url(@/components/common.css);

.all {
    padding: 0rpx 24rpx 0;

    .card {
        width: 100%;
        margin-top: 18rpx;
        padding: 20rpx;
        background: #ffffff;
        border-radius: 10rpx;

        .head-img {
            width: 160rpx;
            height: 160rpx;
            border-radius: 10rpx;
            margin-right: 20rpx;
            flex-shrink: 0;
        }

        .cont {
            width: 100%;

            .name {
                margin-bottom: 12rpx;
                font-size: 28rpx;
            }

            .cate {
                width: fit-content;
                width: -webkit-fit-content;
                width: -moz-fit-content;
                padding: 3rpx;
                background: #fafafa;
                font-size: 22rpx;
                border-radius: 5rpx;
            }

            .price {
                font-size: 40rpx !important;
                font-weight: 550;
                color: #ef5205;

                text {
                    font-weight: 500;
                    font-size: 20rpx;
                }
            }
        }
        .top {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 20rpx;

            .left {
                display: flex;
                align-items: center;

                .mendian {
                    font-size: 28rpx;
                    font-weight: bold;
                }

                .icon_sj {
                    width: 40rpx;
                    height: 40rpx;
                    margin-right: 10rpx;
                }

                .icon_arrow {
                    width: 14rpx;
                    height: 24rpx;
                    margin-left: 10rpx;
                    opacity: 0.5;
                }
            }
        }
        .number {
            width: 120rpx;
            text-align: right;
            font-size: 24rpx;
            color: #b0b0b0;
        }

        .button {
            width: -webkit-fit-content;
            padding: 14rpx 24rpx;
            border: 1rpx solid #939393;
            font-size: 28rpx;
            border-radius: 5rpx;
        }

        .button2 {
            border: 1rpx solid #f43000;
            color: #f43000;
        }

        .button3 {
            border: 1rpx solid #606dce;
            color: #606dce;
        }

        .top-title {
            font-size: 32rpx;
            color: #333333;
        }

        .message-item {
            margin-top: 20rpx;
            font-size: 28rpx;
            color: #bebebe;

            view {
                flex-shrink: 0;
            }

            text {
                text-align: right;
                display: block;
                font-size: 28rpx;
                color: #333333;
            }

            .red-status {
                color: #f43000;
            }
        }
    }
}

.box {
    position: fixed;
    bottom: 0;
    padding: 20rpx 40rpx;
    width: 100%;
    background: #ffffff;

    padding-bottom: calc(24rpx + constant(safe-area-inset-bottom));
    padding-bottom: calc(24rpx + env(safe-area-inset-bottom));

    .btn {
        width: 316rpx;
        height: 92rpx;
        line-height: 92rpx;
        text-align: center;
        border-radius: 10rpx 10rpx 10rpx 10rpx;
        border: 2rpx solid #bebebe;
        font-size: 28rpx;
        color: #bebebe;
    }

    .btn2 {
        color: #ffffff;
        background: linear-gradient(90deg, #606dce 0%, #606dce 100%);
    }

    .btn3 {
        width: 100%;
    }
}

/deep/.u-icon__icon {
    color: #fff !important;
}

.coupon {
    height: 100%;

    .cou_tit {
        padding: 30rpx 0;
        text-align: center;
        font-size: 32rpx;
        color: #ffffff;
        position: fixed;
        top: 0;
        width: 100%;
        z-index: 3;
        background-color: #606dce;
    }

    .name {
        font-size: 28rpx;
        color: #333333;

        image {
            margin-right: 8rpx;
            width: 44rpx;
            height: 44rpx;
            border-radius: 254rpx;
        }
    }

    .copy {
        font-size: 28rpx;
        color: #333333;
    }

    .cou_item {
        margin-bottom: 40rpx;
        position: relative;
        width: 100%;
        height: 210rpx;
        overflow: hidden;
        border-radius: 30rpx;

        .cou_grey {
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            z-index: 2;
            background: rgba(76, 76, 76, 0.5);
        }

        .left {
            width: 471rpx;
            height: 210rpx;
            background: #fff;
            padding: 27rpx 40rpx 0rpx 30rpx;

            .code {
                font-size: 22rpx;
                color: #666666;
            }

            .cou_price {
                margin-right: 25rpx;
                color: #e55d23;
                font-size: 88rpx;
                font-weight: 550;

                text {
                    margin-top: 32rpx;
                    font-size: 26rpx;
                    margin-right: 10rpx;
                }
            }

            .title {
                font-size: 26rpx;
                font-weight: bold;
                color: #333333;
            }

            .tips {
                margin-top: 10rpx;
                width: 154rpx;
                height: 31rpx;
                background: #e55d23;
                font-size: 20rpx;
                color: #ffffff;
            }

            .time {
                height: 20rpx;
                font-size: 22rpx;
                color: #666666;
                margin-top: 35rpx;
            }
        }

        .status {
            width: 220rpx;
            height: 210rpx;
            position: absolute;
            right: 0;
            top: 50%;
            transform: translateY(-50%);
            font-size: 30rpx;
            font-weight: bold;
            color: #fff;
            background: #606dce;
        }
    }
}

.u-node {
    width: 22rpx;
    height: 22rpx;
    border-radius: 100rpx;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #d0d0d0;
}

.u-order-title {
    color: #707070;
    font-weight: bold;
    font-size: 32rpx;
}

.u-order-desc {
    color: rgb(150, 150, 150);
    font-size: 28rpx;
    margin-bottom: 6rpx;

    text {
        color: #f43000;
    }
}

.u-order-time {
    color: rgb(200, 200, 200);
    font-size: 26rpx;
    font-weight: 500;
}

.card2 {
    width: 600rpx;
    padding: 0 40rpx;
    margin-bottom: 20rpx;

    .pop-tit {
        color: #606dce;
        text-align: center;
        margin-top: 30rpx;
        font-size: 35rpx;
        font-weight: 550;
    }

    .item {
        padding: 40rpx 0;
        font-size: 30rpx;

        input {
            font-size: 30rpx;
            text-align: right;
        }

        .ipt-sty,
        .right {
            font-size: 30rpx;
            color: #b0b0b0;
        }

        .right2 {
            color: #333;
        }
    }

    .pop-button {
        margin-top: 40rpx;

        view {
            width: 48%;
            height: 80rpx;
            border-radius: 40rpx;
            border: 1rpx solid #888;
            color: #888;
        }

        .b2 {
            background-color: #606dce;
            border: none;
            color: #fff;
        }
    }
}
.bakbtn1 {
    width: 100%;
    background-color: #fff;
    text-align: center;
    position: fixed;
    top: 80rpx;
    left: 30rpx;
    z-index: 9999;
    display: flex;
    align-items: center;
    // justify-content: space-between;
}
.bakbtn {
    width: 65rpx;
    background: rgba(0, 0, 0, 0.3);
    height: 65rpx;
    border-radius: 50%;
}

.bakbtn image {
    width: 40rpx;
    height: 40rpx;
}

.wulbtn {
    width: 630rpx;
    height: 80rpx;
    background: linear-gradient(135deg, #2bb984 0%, #8cd994 100%);
    border-radius: 40rpx 40rpx 40rpx 40rpx;
    border: 1rpx solid rgba(0, 0, 0, 0);
    font-size: 28rpx;
    color: #ffffff;
    line-height: 0rpx;
    text-align: center;
    line-height: 80rpx;
    margin: 30rpx auto;
}

.layer {
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 99;
    display: flex;
    align-items: flex-end;
}

.wul_layer {
    width: 100%;
    background: #fff;
    border-radius: 20rpx 20rpx 0 0;
    padding: 0 0 50rpx 0;
}

.wultit {
    padding: 50rpx 0;
    text-align: center;
    font-size: 30rpx;
    color: #fff;
    background: #606dce;
    border-radius: 20rpx 20rpx 0 0;
    position: relative;
}

.gbwul {
    width: 30rpx;
    height: 30rpx;
    position: absolute;
    right: 30rpx;
    top: 50rpx;
}

.contbox {
    flex: 1;
    border: 1rpx solid #ededed;
    padding: 20rpx;
    margin-left: 30rpx;
}
</style>
